import { lazy,Suspense } from "react";

//导入路由模块
import {
  BrowserRouter as Router,
  Route,
  Navigate,
  Routes
} from "react-router-dom";

//导入首页与城市选择页面组件
import Home from "./pages/Home/index";//
import AuthRoute from "./components/AuthRoute";//用于访问权限控制，就不懒加载了
//路由懒加载（动态加载组件）
const HouseList=lazy(()=>import("./pages/List/index"))
const Map=lazy(()=>import("./pages/Map/index"))
const Login=lazy(()=>import("./pages/Login/index"))
const Registe=lazy(()=>import("./pages/Registe/index"))
const HouseDetail=lazy(()=>import("./pages/HouseDetail"))
// const AuthRoute=lazy(()=>import("./components/AuthRoute"))
const Rent=lazy(()=>import("./pages/Rent"))
const RentAdd=lazy(()=>import("./pages/Rent/Add"))
const RentSearch=lazy(()=>import("./pages/Rent/Search"))




// import HouseList from "./pages/List/index";
// import Map from "./pages/Map/index";
// import Login from "./pages/Login/index";
// import Registe from "./pages/Registe/index";
// import HouseDetail from "./pages/HouseDetail";


// // 房源发布
// import Rent from './pages/Rent'
// import RentAdd from './pages/Rent/Add'
// import RentSearch from './pages/Rent/Search'

function App() {
  return (
    <Router>    
        <div className="App">{/* 根文件 */}
        <Suspense fallback={<div className="routeloading">加载中.....</div>}>
        <Routes>
          <Route path="/" element={<Navigate to="/home" replace />}></Route>{/* 默认进入 管理路由组件home */}
          <Route path="/home/*" element={<Home></Home>}></Route>{/* 管理路由组件home路径，嵌套路由设置 */}
          <Route path="/houselist" element={<HouseList></HouseList>}></Route>{/* 城市列表组件路径 */}
          {/* <Route path="/map" element={<Map/>}></Route>地图找房组件路径 */}
          <Route path="/map" element={<AuthRoute ><Map/></AuthRoute>}></Route>
          <Route exact path="/rent" element={<AuthRoute ><Rent/></AuthRoute>}></Route>
          <Route path="/rent/add" element={<AuthRoute ><RentAdd/></AuthRoute>}></Route>
          <Route path="/rent/search" element={<RentSearch/>}></Route>
          {/* <Route path="/Myprofile" element={<Myprofile/>}></Route> */}
          <Route path='/login' element={<Login/>}></Route>{/* 登录界面路径 */}
          <Route path='/registe' element={<Registe/>}></Route>{/* 注册界面路径 */}
          <Route path='/detail/:id' element={<HouseDetail/>}></Route>{/* 房屋详情页面路径，通过id传递参数 */}
        </Routes>
        </Suspense>
        </div>
    </Router>
  );
}

export default App;
